
@extends('layout.default')

@section('layout.content') 

<div class="row">
  <div class="col-xs-12">
    <input type="hidden" name="_method" value="put" />
  	<table class="table table-hover table-bordered table-striped">
  		<thead>
        <tr>
          <th style="min-width:130px;">
            账号 
            <a href="javascript:;"><i class="ace-icon fa fa-plus-circle create-staff bigger-120 align-center"></i></a>
          </th>
          <th style="min-width:100px;">名称</th>
          <th style="min-width:70px;">所属分支</th>
          <th style="min-width:210px;">角色(权限)</th>
          <th class="center" style="min-width:50px;">状态</th>
          <th style="min-width:100px;">上次登录</th>
        </tr>
      </thead>

      <tbody>
        @foreach ($staffs as $staff)
        <tr>
          <td class="td-staff">
            {{ $staff->username }}
            <div class="pull-right operate">
              <a href="javascript:;" class="red edit-staff" data-id="{{$staff->id}}"><i class="fa iconfont">&#xe760;</i></a>
            </div>
          </td>
          <td>{{ $staff->name }}</td>
          <td>{{ $staff->branch->name }}</td>
          <td>{{ $staff->roles()->pluck('name')->implode(', ') }}</td>
          <td class="center">{!! $staff->present()->staffStatus !!}</td>
          <td>{{ time()}}</td>
        </tr>
        @endforeach
      </tbody>
  	</table>
    
  </div><!-- /.col -->
</div><!-- /.row -->

@stop

@section('javascript')
<script type="text/javascript">

  $(function() {
    
    $('.edit-staff').on('click', function() {
      var id = $(this).data('id');
      var uri = '/system/staff/'+id+'/edit';      
      layer.open({
          type: 2,
          title: '账号设置',
          area: ['320px', '495px'],
          shade: 0.8,
          content: uri,
        });      
    });


    $('.create-staff').on('click', function() {
      var uri = '/system/staff/create';
      layer.open({
          type: 2,
          title: '账号创建',
          area: ['300px', '470px'],
          shade: 0.8,
          content: uri,
        });      
    });


    $('.status').on('click', function() {
      var that = $(this);
      var id = that.data('id');
      var uri = '/setup/staff/change/'+id;
      $.post(uri, {
        '_token':$("input[name='_token']").attr('value'),
        '_method': $("input[name='_method']").attr('value'),
        'is_submit': true
      }, function(data) {
          if (data.status === true) {
            if(data.data.status == 1)
              that.parent().attr('class','red');
            else
              that.parent().attr('class','green');
          }
      },'json').error(function(data){
        layer.msg(data.responseJSON.message);
      }); 
    });
   

    $('.td-staff').on('mouseenter', function () {
        $(this).find('.operate').show();
    }).on('mouseleave', function () {
        $(this).find('.operate').hide();
    });

  });

</script>
@stop